<template>
  <div>
    <!--  订单日志  -->
    <el-dialog
      title="订单日志"
      :visible.sync="open"
      width="70%" @close="close">
      <div class="edit-box">
        <el-table :data="groupChildOrderList" align="center" style="width: 100%" border>
          <el-table-column prop="orderId" label="订单号" align="center"></el-table-column>
          <el-table-column prop="intlTrackingNo" align="center" label="国际运单号"></el-table-column>
          <el-table-column prop="sellerLoginId" label="店铺账号" align="center"></el-table-column>
          <el-table-column prop="solutionCode" label="物流方案" align="center"></el-table-column>
          <el-table-column prop="statusIntro" align="center" label="产品图片">
            <template slot-scope="scope">
              <div class="flex">
                <span v-for="(item,index) in scope.row.photoProduct" :key="index" class="mr5">
                  <imagePreview :src="item" width="60px" height="60px"/>
                </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="gmtCreate" align="center" label="订单创建时间"></el-table-column>
          <el-table-column prop="gmtCreate" align="center" label="订单剩余时间">
            <template slot-scope="scope">
              <span class="text-danger">
                <count-down :endTime="endTime(scope.row.leftEndGoodTime)" endText="已结束"/>
              </span>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="close">取 消</el-button>
        <el-button type="primary" @click="close">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {selectHandoverOrderDetails} from "@/api/order/purchaser";
import countDown from '@/views/components/countDown/index';

export default {
  name: 'order-log',
  props: {
    handoverOrderId: {
      type: String / Number
    },
  },
  components: {
    countDown
  },
  computed: {
    endTime() {
      return time => {
        return new Date(
          time).getTime() / 1000 + ' '
      }
    },
  },
  data() {
    return {
      open: false,
      groupChildOrderList: [],//订单日志列表
    }
  },
  created() {
    this.selectHandoverOrderDetails()
  },
  methods: {
    // 获取已组包订单中子订单列表
    selectHandoverOrderDetails() {
      console.log('this.handoverOrderId', this.handoverOrderId)
      selectHandoverOrderDetails({handoverOrderId: this.handoverOrderId}).then(response => {
        this.groupChildOrderList = response.data
        this.open = true
      })
    },
    // 关闭线上发货弹窗
    close() {
      this.$emit('closeGroupCheckOrder', false)
    },
  }
}
</script>
<style scoped>

</style>
